<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HP-HR - 员工档案列表 </title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link rel="shortcut icon" href="favicon.ico">
    <link href="${path}/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${path}/css/font-awesome.css?v=4.4.0" rel="stylesheet">

    <!-- Data Tables -->
    <link href="${path}/css/plugins/dataTables/dataTables.bootstrap.css"
          rel="stylesheet">
    <link href="${path}/css/animate.css" rel="stylesheet">
    <link href="${path}/css/style.css?v=4.1.0" rel="stylesheet">

</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>员工列表</h5>
                </div>
                <div class="ibox-content">
                    <table class="table table-striped table-bordered table-hover dataTables-example">
                        <thead>
                        <tr>
                            <th>序号</th>
                            <th>工号</th>
                            <th>姓名</th>
                            <th>性别</th>
                            <th>生日</th>
                            <th>电话</th>
                            <th>电子邮件</th>
                            <th>籍贯</th>
                            <th>学历</th>
                            <th>入职日期</th>
                            <th>离休日期</th>
                            <th>部门</th>
                            <th>职称</th>
                            <th>员工状态</th>
                            <th>家庭住址</th>
                            <th>备注</th>

                        </tr>
                        </thead>
                        <tbody>
                        <c:forEach items="${page.records}" varStatus="his" var="historyBys" >
                            <tr class="gradeA">
                                <td>${his.count}</td>
                                <td>${historyBys.employee_number}</td>
                                <td>${historyBys.name}</td>
                                <td>${historyBys.gender}</td>
                                <td>${historyBys.birthday}</td>
                                <td>${historyBys.telephone}</td>
                                <td>${historyBys.email}</td>
                                <td>${historyBys.address}</td>
                                <td>${historyBys.education}</td>
<%--                                <td>${history.in_time}</td>--%>
<%--                                <td>${history.out_time}</td>--%>
                                <td><fmt:formatDate value="${historyBys.in_time}" pattern="yyyy-MM-dd"></fmt:formatDate> </td>
                                <td><fmt:formatDate value="${historyBys.out_time}" pattern="yyyy-MM-dd"></fmt:formatDate> </td>
                                <td>${historyBys.department_name}</td>
                                <td>${historyBys.position_name}</td>
                                <td>${historyBys.status}</td>
                                <td>${historyBys.home}</td>
                                <td>${historyBys.notes}</td>
                            </tr>
                        </c:forEach>
                        </tbody>
                    </table>
                    <div>
							<span style="float: left; padding: 5px">
								当前&nbsp;<span style="color: red;">${page.current}</span>&nbsp;/&nbsp;<b>${page.pages}</b>&nbsp;页&nbsp;&nbsp;
								总共&nbsp;<b>${page.total}</b>&nbsp;条</span>
                        <nav aria-label="Page navigation" style="margin: 0 auto; width: 240px">
                            <ul class="pagination" style="margin: 0;">
                                <li>
                                    <a href="${path}/historyList?pageNo=${page.current-1>1?page.current-1:1}"
                                       aria-label="Previous"> <span aria-hidden="true">前一页</span>
                                    </a>
                                </li>
                                <c:forEach items="${page.records}" var="dep" varStatus="status">
                                    <c:if test="${status.index+1<=page.pages}">
                                        <li><a href="${path}/historyList?pageNo=${status.index+1}">${status.index+1}</a></li>
                                    </c:if>
                                </c:forEach>
                                <li><a href="${path}/historyList?pageNo=${page.current+1<page.pages?page.current+1:page.pages}"
                                       aria-label="Next"> <span aria-hidden="true">后一页</span>
                                </a></li>
                            </ul>
                        </nav>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>
<!-- 全局js -->
<script src="${path}/js/jquery.min.js?v=2.1.4"></script>
<script src="${path}/js/bootstrap.min.js?v=3.3.6"></script>
<script src="${path}/js/plugins/jeditable/jquery.jeditable.js"></script>

<!-- Data Tables -->
<script src="${path}/js/plugins/dataTables/jquery.dataTables.js"></script>
<script src="${path}/js/plugins/dataTables/dataTables.bootstrap.js"></script>

<!-- 自定义js -->
<script src="${path}/js/content.js?v=1.0.0"></script>
<%--<script>
    $(document).ready(function () {
        $('.dataTables-example').dataTable();

        var oTable = $('#editable').dataTable();

        oTable.$('td').editable('../example_ajax.php', {
            "callback": function (sValue, y) {
                var aPos = oTable.fnGetPosition(this);
                oTable.fnUpdate(sValue, aPos[0], aPos[1]);
            },
            "submitdata": function (value, settings) {
                return {
                    "row_id": this.parentNode.getAttribute('id'),
                    "column": oTable.fnGetPosition(this)[2]
                };
            },
            "width": "90%",
            "height": "100%"
        });
    });
</script>--%>
</body>
</html>
